﻿@*
    Time:2018.08.02
    Author:jame
    Instructions:分页组件, 使用方式<home-page v-on:refreshbizlines="paln" ref="homePage"></home-page>
    组件切换页面，数量时用过refreshbizlines调用paln
    分页组件的参数在主页上,通过v-bind:pages='pages'传给组件(不用了)
    主页操作方式 this.$refs.homePage.total = 1000;
    发送请求传页码跟每页条数时用this.$refs.homePage.currentPage/pageSize
    获取到一共多少条时 this.$refs.homePage.total = data.Total
    注：主页点击搜索时需要使分页页码变成1，this.$refs.homePage.currentPage = 1;
    @Html.Partial("component/_HomePage")
    页面进去就需要请求数据的时候 放到mounted里面
    components: {
                    'homePage': homePages,
                },
*@
<template id="homePage" style="display:none;">
    <div>
        <el-pagination @@size-change="handleSizeChange"
                       background
                       size="mini"
                       @@current-change="handleCurrentChange"
                       v-bind:current-page="currentPage"
                       v-bind:page-sizes="pageSizes"
                       v-bind:page-size="pageSize"
                       layout="total, sizes, prev, pager, next, jumper"
                       v-bind:total="total">
        </el-pagination>
    </div>
</template>
<script>
    var homePages = {
        template: '#homePage',
        data: function () {
            return {
                currentPage: 1,//当前页
                pageSizes: [10, 15,30,50, 100],//每页显示条数数组
                pageSize: 15,//每页显示条数
                total:0,//总条数
            }
        },
        methods:{
            handleSizeChange: function (v) {//切换每页显示数量
                this.pageSize = v;
                this.$emit('refreshbizlines');
            },
            handleCurrentChange: function (v) {//切换页码
                this.currentPage = v;
                this.$emit('refreshbizlines');
            },
        }
    }
</script>